<template>
	<view class="details-body">
		<video :src="taskDetail.video" class="details-video"></video>
		<view class="campus-student">
			<view style="width: 100%;">
				<view class="campus-student_name text_black">
					{{taskDetail.title}}
				</view>
				<!-- <view class="campus-student_msg text_opblack">
					{{taskDetail.sub_title}}
				</view> -->
			</view>
		</view>
		<view class="details-msg">
			<view class="details-msg-title text_opblack">课程详情</view>
			<view v-html="taskDetail.content" class="details-msg-item" style="margin-bottom: 0;"></view>
		</view>
		<video v-if="taskDetail.user_video!=null" :src="taskDetail.user_video" class="details-video"
			style="margin-top: 10rpx;"></video>
		<view class="button" v-if="taskDetail.user_video!=null&&isSubmit==0" @click="submit">提交</view>
		<view class="return-button" v-if="taskDetail.user_video!=null&&isSubmit==0" @click="upload">重新上传</view>
		<view class="button" v-if="taskDetail.user_video==null" @click="upload">上传训练视频,完成打卡</view>
		<!-- <view class="details-msg-item-content text_opblack" v-if="taskDetail.user_video==null">打卡：请跟着上面的训练视频练习，然后上传自己的训练视频</view> -->
		<view class="details-msg" style="margin-top: 30rpx;" v-if="isSubmit==0">
			<view class="details-msg-title text_opblack">打卡说明</view>
			<view class="details-msg-item" style="margin-bottom: 0;">
				<view class="details-msg-item-content text_opblack">1. 每个参赛者只允许每个视频打卡一次</view>
				<view class="details-msg-item-content text_opblack">2. 您可以重新上传打卡视频，但提交后不能更改</view>
			</view>
		</view>

		<view class="details-submitTips" v-if="taskDetail.user_video!=null&&isSubmit==1">
			<view class="text_black">我的训练视频</view>
			<view class="text_opblack">打卡成功</view>
		</view>
		<!-- 权限弹框 -->
		<view class="quanxian" v-if="quanShow">
			<view class="">
				存储空间/相机权限说明
			</view>
			<view class="">
				用于在添加、制作、上传、发布、分享、下载、搜索、识别图片和视频等场景中读取和写入相册和文件内容，拒绝将无法使用相关功能
			</view>
		</view>
	</view>
</template>

<script>
	import Cache from "../../static/js/cache.js";
	import {
		getTaskDetail,
		upload
	} from "../../static/js/api/plan.js"
	import config from "../../static/js/config.js"
	export default {
		data() {
			return {
				baseUrl: '',
				courseInfo: {},
				isSubmit: 0,
				detailId: null,
				taskDetail: {},
				quanShow: false,
				// status:状态：1待评价 2:优秀 3良好 4再接再厉
				// is_recommend  1:是 2:否'
			}
		},
		onLoad(option) {
			if (option.details) {
				this.taskDetail = JSON.parse(option.details)
				if (this.taskDetail.user_video != null) {
					this.isSubmit = 1
				}
				console.log(50, this.taskDetail)
			}
			// if(option.id){
			// 	this.detailId = option.id
			// this.getTaskData()
			// }
			this.baseUrl = config.baseUrl
		},
		methods: {
			getTaskData() {
				// getTaskDetail({
				// 	id:this.detailId
				// }).then(res=>{
				// 	this.taskDetail = res.detail
				// 	if(this.taskDetail.user_video.length>0){
				// 		this.isSubmit = 1
				// 	}
				// 	console.log(res.detail)
				// })
			},
			// 上传视频
			upload() {
				let _that = this
				let system = uni.getSystemInfoSync();
				if (system.platform === 'android') {
					_that.quanShow = true
					plus.android.requestPermissions(['android.permission.CAMERA'],
						(e) => {
							if (e.deniedAlways.length > 0) {
								
								// 弹出提示框解释为何需要权限，引导用户打开设置页面开启  
								uni.showModal({
									title: '提示',
									content: '请打开手机相机相册功能（点击确定后在权限中授权相机相册功能）',
									// showCancel: false, // 不显示取消按钮
									success(res) {
										if (res.confirm) {
											var Intent = plus.android.importClass("android.content.Intent");
											var Settings = plus.android.importClass(
												"android.provider.Settings");
											var Uri = plus.android.importClass("android.net.Uri");
											var mainActivity = plus.android.runtimeMainActivity();
											var intent = new Intent();
											intent.setAction(Settings.ACTION_APPLICATION_DETAILS_SETTINGS);
											var uri = Uri.fromParts("package", mainActivity.getPackageName(),
												null);
											intent.setData(uri);
											mainActivity.startActivity(intent);
										}
									}
								});
							} else if (e.deniedPresent.length > 0) { //权限被临时拒绝  
								// 弹出提示框解释为何需要权限，可再次调用plus.android.requestPermissions申请权限  
								uni.showModal({
									title: '提示',
									content: '请打开手机相机功能（点击确定后在权限中授权相机功能）',
									// showCancel: false, // 不显示取消按钮
									success(res) {
										if (res.confirm) {
											var Intent = plus.android.importClass("android.content.Intent");
											var Settings = plus.android.importClass(
												"android.provider.Settings");
											var Uri = plus.android.importClass("android.net.Uri");
											var mainActivity = plus.android.runtimeMainActivity();
											var intent = new Intent();
											intent.setAction(Settings.ACTION_APPLICATION_DETAILS_SETTINGS);
											var uri = Uri.fromParts("package", mainActivity.getPackageName(),
												null);
											intent.setData(uri);
											mainActivity.startActivity(intent);
										}
									}
								});
							} else {
								plus.android.requestPermissions(['android.permission.READ_EXTERNAL_STORAGE'], (e) => {
									if (e.deniedAlways.length > 0) { //权限被永久拒绝  
										// 弹出提示框解释为何需要权限，引导用户打开设置页面开启  
										uni.showModal({
											title: '提示',
											content: '请打开相册存储功能（点击确定后在权限中授权相册存储功能）',
											// showCancel: false, // 不显示取消按钮
											success(res) {
												if (res.confirm) {
													var Intent = plus.android.importClass(
														"android.content.Intent");
													var Settings = plus.android.importClass(
														"android.provider.Settings");
													var Uri = plus.android.importClass(
														"android.net.Uri");
													var mainActivity = plus.android
														.runtimeMainActivity();
													var intent = new Intent();
													intent.setAction(Settings
														.ACTION_APPLICATION_DETAILS_SETTINGS);
													var uri = Uri.fromParts("package", mainActivity
														.getPackageName(),
														null);
													intent.setData(uri);
													mainActivity.startActivity(intent);
												}
											}
										});
									} else if (e.deniedPresent.length > 0) { //权限被临时拒绝  
										// 弹出提示框解释为何需要权限，可再次调用plus.android.requestPermissions申请权限  
										uni.showModal({
											title: '提示',
											content: '请打开相册存储功能（点击确定后在权限中授权相册存储功能）',
											// showCancel: false, // 不显示取消按钮
											success(res) {
												if (res.confirm) {
													var Intent = plus.android.importClass(
														"android.content.Intent");
													var Settings = plus.android.importClass(
														"android.provider.Settings");
													var Uri = plus.android.importClass(
														"android.net.Uri");
													var mainActivity = plus.android
														.runtimeMainActivity();
													var intent = new Intent();
													intent.setAction(Settings
														.ACTION_APPLICATION_DETAILS_SETTINGS);
													var uri = Uri.fromParts("package", mainActivity
														.getPackageName(),
														null);
													intent.setData(uri);
													mainActivity.startActivity(intent);
												}
											}
										});
									} else {
										//在此处可以进行操作可以使用uni.chooseImage()
										_that.quanShow = false
										uni.chooseVideo({
											sourceType: ['camera', 'album'],
											success: (res) => {
												console.log(res.tempFile)
												var imageSrc = res.tempFilePath
												_that.taskDetail.user_video = res.tempFilePath
											},
											fail: (err) => {
												console.log('chooseImage fail', err)
											}
										})

									}
								})
							}
						})
				} else {
					uni.chooseVideo({
						sourceType: ['camera', 'album'],
						success: (res) => {
							console.log(res.tempFile)
							var imageSrc = res.tempFilePath
							_that.taskDetail.user_video = res.tempFilePath
						},
						fail: (err) => {
							console.log('chooseImage fail', err)
						}
					})
				}
			},
			// 提交
			submit() {
				uni.showLoading({
					title: '上传中'
				})
				uni.uploadFile({
					url: config.baseUrl + '/sport/upload', //仅为示例，非真实的接口地址
					filePath: this.taskDetail.user_video,
					name: 'file',
					header: {
						'token': Cache.cache.get('token'),
					},
					formData: {
						'sport_id': this.taskDetail.sport_id,
						'section_id': this.taskDetail.section_id,
						'sport_course_id': this.taskDetail.id,
						'sport_user_id': this.taskDetail.sport_user_id
					},
					success: (res) => {
						console.log(res)
						uni.hideLoading();
						uni.showToast({
							title: '恭喜您，打卡成功！',
							icon: 'success',
							duration: 1000
						})
						this.isSubmit = 1
					},
					fail: (err) => {
						uni.hideLoading();
						uni.showToast({
							title: err.errMsg,
							icon: "error"
						});
					},
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("./index.scss");

	.quanxian {
		background: #fff;
		padding: 24rpx;
		border-radius: 26rpx;
		position: fixed;
		top: 200rpx;
		left: 24rpx;
		right: 24rpx;

		view:first-child {
			font-size: 32rpx;
			color: #000;
			font-weight: bold;
		}

		view:last-child {
			font-size: 28rpx;
			color: #555;
			margin-top: 14rpx;
			line-height: 30rpx;
		}
	}

	.details-body {
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}

	.text_opblack {
		color: $uni-text-color-opblack;
	}

	.text_black {
		color: $uni-text-color-black;
	}

	.text_active {
		color: #FF6E00 !important;
	}

	.button {
		margin-top: 30rpx;
	}

	.details-msg-item {
		::v-deep p {
			line-height: 40rpx;
			margin-bottom: 20rpx;
			font-size: 28rpx;
			color: $uni-text-color-opblack;
		}

		::v-deep b {
			color: $uni-text-color-black;
			font-size: 28rpx;
		}
	}
</style>